<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2017/7/27
  Time: 9:33
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
  <head>
    <title>$Title$</title>
    <script src="js/jquery-3.2.1.min.js"></script>
    <script src="js/angular.min.js"></script>
  </head>
  <body>
     <form action="/LoginServlet" method="post">
        <table>
          <tr>
            <td>用户名</td>
            <td><input type="text" name="username"></td>
          </tr>
          <tr>
            <td>密码</td>
            <td><input type="password" name="password"></td>
          </tr>
          <tr>
            <td colspan="2" >
              <input type="submit" value="登录">
            </td>
          </tr>
        </table>
     </form>
      <button id="btn-test">测试</button>
     <div ng-app = "myApp" ng-controller="angTest">
       <button ng-click="hello()">angular</button>
         <table>
             <tr ng-repeat="x in datas">
                 <td>{{x.name}}</td>
                 <td>{{x.age}}</td>
                 <td>{{x.remark}}</td>
             </tr>
         </table>

         <form>
             <input type="checkbox" ng-model="chkVar">复选框
             <input type="radio" ng-model="sex" name="sex" value="男" ng-checked="true">男
             <input type="radio" ng-model="sex" name="sex" value="女">女
         </form>
     </div>
      <script>
        $(function () {
            $('#btn-test').click(function () {
                $.ajax({
                    url: "AjaxServlet",
                    type: "post",
                    contentType: "application/json",
                    data:'',
                    success: function (data) {
                        console.log(data[0]);
                    }
                });
            });

            $(document).on("click", "#btn-test", function () {
                alert("ok");
            });

            $("body").ready(function () {
                alert("Hi");
            })
        });

        var app = angular.module("myApp", []);
        app.controller("angTest",function ($scope, $http) {
            $scope.chkVar = true;
            $scope.sex = "男"
            $scope.hello = function () {
                $http({

                    method:'post',

                    url:'AjaxServlet',

                    data:{name:"aaa",id:1,age:20}

                }).success(function(req){

                    console.log(req);
                    $scope.datas = req;
                });
                console.log($scope.chkVar);
                console.log($scope.sex);
            }

        })
      </script>
  </body>
</html>
